import React, { FC } from 'react'
import welfareUrl from '@/assets/images/order_card_welfare_pic_2x.png'
import { OrderDetailProduct } from '@/types/orderList/orderDetail'
import Welfare from './welfare'
interface OrderGoodsParam {
  product: OrderDetailProduct
}
const orderDetail: FC<OrderGoodsParam> = (props) => {
  const data = props.product
  return (
    <div className="w-full p-r1.2 ">
      <div className="w-full text-gray-333333 text-r1.4 font-medium relative">
        <span className=" text-white bg-orange-DCAF80 font-normal text-r1.2  h-r1.6 w-r2.8 text-center rounded-r0.2 inline-block mr-r0.4">
          {data.subjectName}
        </span>
        <span className=" leading-r2.2">{data.productName}</span>
        <span className=" leading-r2.2 absolute right-2 ">¥{data.resale}</span>
      </div>
      <div className=" mt-r0.8 mb-r0.8 text-gray-666666 font-normal font-regular">
        {data.showName} ·共{data.totalSections}讲
      </div>
      <div className=" mt-r1.2 mb-r1.2 text-gray-999999  font-normal font-regular">
        {props.product.mainTeacherName.map((val, key) => {
          return (
            <span key={key}>
              <span>
                {'授课'}：{val}
              </span>
            </span>
          )
        })}
        {props.product.foreignTeacherName.map((val, key) => {
          return (
            <span key={key}>
              <span>
                {'外教'}：{val}
              </span>
            </span>
          )
        })}
      </div>
      <div className="w-full bg-white leading-r1.9 ">
        <Welfare
          goodsData={props.product.giveawayInfos.goodsData}
          othersData={props.product.giveawayInfos.othersData}
        ></Welfare>
      </div>
    </div>
  )
}
export default orderDetail
